<template>
	<view class="aboutAct">
		<view class="activityList flex justConBetween">
			<view class="leftBox">
				<template v-for="(item,index) in activityData">
					<view class="actOne" :key="index" v-if="index%2==0">
						<uni-activity :activityItem="item" :groupId="groupId" :canOffline="true" :key="index" @actComOper="actComOper"></uni-activity>
					</view>
				</template>
			</view>
			<view class="rightBox">
				<template v-for="(item,index) in activityData">
					<view class="actOne" :key="index" v-if="index%2!=0">
						<uni-activity :activityItem="item" :groupId="groupId" :canOffline="true" :key="index" @actComOper="actComOper"></uni-activity>
					</view>
				</template>
			</view>
		</view>
		<uni-nodata v-if="activityData.length==0"></uni-nodata>
	</view>
</template>

<script>
	import { activityList } from "@/api/school.js"
	export default {
		data() {
			return {
				activityData:[],
				groupId:'',
				page:1,
				pageSize:20,
				pageTotal:0,
			};
		},
		onLoad(option) {
			if(option.id){
				this.groupId=option.id
			}
			this.getGroupAct()
		},
		methods:{
			initPage(){
				this.page=1;
				this.activityData=[]
			},
			// 小组活动
			getGroupAct(){
				let param={
					page:1,
					size:10,
					teamId:this.groupId
				}
				activityList(param).then((res)=>{
					if(res.code==100000){
						this.activityData=this.activityData.concat(res.data.rows)
						this.pageTotal=Math.ceil(res.data.total/this.pageSize)
					}
				}).catch((err)=>{})
			},
			// 活动的操作
			actComOper(obj){
				if(obj.type=='offline'){
					this.initPage()
					this.getGroupAct()
				}
			}
		},
		onPullDownRefresh() {
			this.initPage()
			this.getGroupAct()
			setTimeout(()=>{
				uni.stopPullDownRefresh()
			},1000)
		},
		onReachBottom() {
			if(this.page<this.pageTotal){
				++this.page
				this.getList()
			}else{
				uni.showToast({
					title:'我也是有底线的',
					icon:'none'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.activityList{
	flex-wrap: wrap;
	padding: 30rpx;
	box-sizing: border-box;
	&>view{
		flex: 0 0 48%;
	}
	.actOne{
		margin-bottom: 30rpx;
		border-radius:8rpx;
	}
}
</style>
